<% /**
	* index.jsp
	* 
	* for graphing
	*
	* @author Victor Vazquez
	*/
%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@page import="b1w1nn1ng.crossf1t.gui.*, b1w1nn1ng.crossf1t.business.*"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>	
		<title>Graph </title>
		<jsp:include page="/detectBrowser.jsp" />	
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="highcharts.js"></script>
		<script type="text/javascript" src="gray.js"></script>
		
	</head>
<body>

<div id="container">
		<h1> Graphing </h1> <hr />
		<jsp:include page="/navbar.jsp" />
		<br>
		<br>
		<div id ="container2"></div>	
</div>

<% 
	String[] selectedFriends = request.getParameterValues("friend");
	String value = request.getParameter("secondary");
	String[] temp = Graph.getOptions(value, selectedFriends);
	
%>



<script language ='JavaScript' TYPE="text/javascript">
	var chart;
$(document).ready(function() {
	var options = {
		chart: {
			renderTo: 'container2',
			defaultSeriesType: 'line'
			},
		title: {
			text: '<%=value%>'
			},
		subtitle: {
			text: ''
			},
		xAxis: {
			categories:[0],
			title:{
				text: 'Day'
			},
	},
		yAxis: {
			title: {
				text: 'Weight(lbs)'
				}
			},
		tooltip: {
			enabled: false,
			formatter: function() {
			return '<b>'+ this.series.name +'</b><br/>'+
								this.x +': '+ this.y +'°C';
			}
			},
		plotOptions: {
			line: {
			  dataLabels: {
			    enabled: true
				      },
			  enableMouseTracking: false
			       }
			},
		series: [{
			name: 'Victor',
			data: [ 1,2]
			}]
	}
	<%
	for(int i =0;i<selectedFriends.length;i++)
	{
	%>
		options.series.push({name: '<%= selectedFriends[i] %>', data: [<%=temp[i]%>]})
	<% } %>
	chart = new Highcharts.Chart(options);
	//var nothing = '<%= temp[0] %>';
	//alert(nothing);

});
	</script>		

</body>
</html>
